﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">    
<head>
    <script type="text/javascript" src="C:\jQuery\jcarousel\lib\jquery-1.4.2.min.js"></script>
    <script type="text/javascript" src="C:\jQuery\jcarousel\lib\jquery.jcarousel.min.js"></script>    
    <link rel="stylesheet" type="text/css" href="C:\jQuery\jcarousel\skin\skin.css" /> 
    <script type="text/javascript">
    jQuery(document).ready(function() {
        jQuery('#mycarousel').jcarousel({
            // Configuration goes here
             itemLoadCallback: itemLoadCallbackFunction
        });
    });
    function itemLoadCallbackFunction(carousel, state)
    {
        for (var i = carousel.first; i <= carousel.last; i++) {
            // Check if the item already exists
            if (!carousel.has(i)) {
                // Add the item
                carousel.add(i, "I'm item #" + i);
            }
        }
    };
    </script>
    <title>Untitled Page</title>
</head>
<body>
    <ul id="mycarousel" class="jcarousel-skin-name">
       <!-- The content goes in here -->
    </ul>
</body>
</html>
